<template>
  <!-- https://swiperjs.com/vue -->
  <Swiper
    :modules="[SwiperAutoplay, SwiperNavigation, SwiperPagination]"
    :loop="true"
    :autoplay="{
      delay: 1000,
      disableOnInteraction: true,
    }"
    pagination
    navigation
  >
    <SwiperSlide v-for="img in imageList" :key="img.id">
      <img :src="img.imgUrl" />
    </SwiperSlide>
  </Swiper>
</template>

<script lang="ts" setup>
defineOptions({
  name: "Carousel",
});

import type { BannerList } from "@/api/home";

defineProps<{
  imageList: BannerList;
}>();
</script>

<style scoped lang="scss"></style>
